<script setup>
import {onMounted, reactive, ref} from "vue";
import PageComponent from "@/components/index/PageComponent.vue";
import {$ajax, apiUrl} from "@/utils/ajax";

const data = reactive([])
const loading = ref(false)
const pageSize = ref(30)
const page = ref(1)
const total = ref(0)
const handlData = (p) => {
  page.value = p
  loading.value = true
  $ajax.get(`${apiUrl}admin/supplier/recodePage`, {
    params: {
      page: page.value,
      pageSize: pageSize.value,
      // pid: route.params.id
    }
  }).then(({data: {result: {lst, total: tol}}}) => {
    data.splice(0, data.length, ...lst)
    total.value = tol
    loading.value = false
  }).catch(() => loading.value = false)
}
onMounted(()=>{
  handlData(1)
})
</script>

<template>
  <div class="breadcrumb">
    <el-breadcrumb>
      <el-breadcrumb-item :to="{name:'home'}">首页</el-breadcrumb-item>
      <el-breadcrumb-item>礼包领取记录</el-breadcrumb-item>
    </el-breadcrumb>
  </div>
  <el-table :data="data" v-loading="loading" height="70vh" border stripe size="small" class="table-data">
    <el-table-column label="礼包" prop="gift.name"></el-table-column>
    <el-table-column label="领取码" prop="code"></el-table-column>
    <el-table-column label="领取手机号" prop="mobile"></el-table-column>
    <el-table-column label="领取时间" prop="draw_time"></el-table-column>
    <el-table-column label="渠道" prop="plate.name"></el-table-column>
  </el-table>
  <page-component :size="pageSize" :page="page" :total="total" @get-data="handlData"/>
</template>

<style scoped lang="scss">

</style>
